<template>
  <div class="updateCourseArrangement">
    <el-breadcrumb separator="/" class="breadcrumb-bottom">
      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>课程管理</el-breadcrumb-item>
      <el-breadcrumb-item>修改排课表</el-breadcrumb-item>
    </el-breadcrumb>
    <el-dialog title="选择教师" v-model="dialogFormVisible">
        <el-col :span="8">
              <el-select v-model="form.majorID" placeholder="请选择专业" class="max-width">
               <el-option
                  v-for="item in majorList"
                  :label="item.majorName"
                  :value="item.majorID">
               </el-option>
              </el-select>
       </el-col>
       <el-col :span="4">
        <div class="overflow-clear">
          <el-button type="primary" class="add-pd-26 float-right" @click="searchTeacher">搜索</el-button>
        </div>
       </el-col>
       
       <el-table
      :data="teachers"
      border
      style="width: 100%"
       @select="selectEvent"
      :default-sort="{prop: 'teacherID',order:'ascending'}">
      <el-table-column
        type="selection"
        width="55">
      </el-table-column>
      <el-table-column
        prop="teacherID"
        label="教师编号"
        min-width="160"
        sortable>
      </el-table-column>
      <el-table-column
        prop="teacherName"
        label="教师姓名"
        min-width="160"
        sortable>
      </el-table-column>
      <el-table-column
        prop="teacherPosition"
        label="职位"
        min-width="160"
        sortable>
      </el-table-column>
      <el-table-column
        prop="positionalTitle"
        label="职称"
        min-width="160"
        sortable>
      </el-table-column>
    </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="update">修改</el-button>
      </div>
    </el-dialog>
    <el-table
      :data="courseInfo"
      style="width: 100%">
      <el-table-column
        prop="teacherName"
        label="任课老师"
        min-width="120"
        sortable>
      </el-table-column>
      <el-table-column
        prop="teacherID"
        label="教师编号"
        min-width="120"
        sortable>
      </el-table-column>
      <el-table-column
        prop="positionalTitle"
        label="教师职称"
        min-width="120">
      </el-table-column>
      <el-table-column
        prop="courseID"
        label="课程编号"
        min-width="120"
        sortable>
      </el-table-column>
      <el-table-column
        prop="courseNameCN"
        label="所任课程"
        min-width="140">
      </el-table-column>
      <el-table-column
        prop="className"
        label="所任班级"
        min-width="130">
      </el-table-column>
      <el-table-column
        prop="weeks"
        label="上课周数"
        min-width="120">
      </el-table-column>
      <el-table-column
        prop="weeklyHour"
        label="周学时数"
        min-width="120">
      </el-table-column>
      <el-table-column
        prop="isUseMedia"
        label="是否使用多媒体"
        min-width="150">
      </el-table-column>
      <el-table-column
        label="操作"
        min-width="120">
        <template scope="scope">
          <el-button icon="edit" type="text" @click="updateCourseArr(scope.row.teacherCourseID)"></el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
  export default {
    name: 'updateCourseArrangement',
    data() {
      return {
        addCourseForm: {
          teacherCourseID:'',
          teacherID:''
        },
        form:{
        	majorID:''
        },
        majorList:[],
        checkOpinion:'',
        courseInfo: [],
        teachers:[],
        updateState: false,
        dialogFormVisible: false,
        formLabelWidth: '120px',
        teacherCourseID: '',
        teacherID:''
        
      }
    },
    created () {
		this.query();
		this.getMajor();
		this.searchTeacher();
    },
    methods: {
    	selectEvent(selection, row){
	        this.teacherID = row.teacherID
      	},
    	getMajor(){
        		this.$http.get(`http://localhost:8080/TeachingMIS/common/getMajorList`)
		          .then((res) => {
		            console.log(res)
		            this.majorList = res.body
		          }, (err) => {
		            // 响应错误回调
		            //console.log(err)
		          })
      		},
       query() {
      	var courseArrangeID = this.$route.query.courseArrangeID;
      	alert(courseArrangeID);
        this.$http.post(`http://localhost:8080/TeachingMIS/courseArrange/getCourseArrList`, {courseArrangeID:courseArrangeID}).then((res) => {
		          // 响应成功回调
		          console.log(res.body)
		          this.courseInfo = res.body.arrangeList;
		        }, (err) => {
		          // 响应错误回调
		          console.log("服务器异常！");
		        })

      },
      searchTeacher(){
      	this.$http.post(`http://localhost:8080/TeachingMIS/courseArrange/getTeachers`, this.form).then((res) => {
		          // 响应成功回调
		          console.log(res.body)
		          this.teachers = res.body.teachers;
		        }, (err) => {
		          // 响应错误回调
		          console.log("服务器异常！");
		        })
      },
      updateCourseArr(teacherCourseID){
        this.dialogFormVisible = true
        this.addCourseForm.teacherCourseID = teacherCourseID;
      },
      update(){
      	alert(this.teacherID);
      	this.addCourseForm.teacherID = this.teacherID;
      	this.$http.post(`http://localhost:8080/TeachingMIS/courseArrange/updateTeacher`, this.addCourseForm).then((res) => {
		          // 响应成功回调
		          alert("修改成功！");
		        }, (err) => {
		          // 响应错误回调
		          console.log("服务器异常！");
		        })
        this.dialogFormVisible = false
      }
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .add-pd-26 {
    padding-left: 1.6em;
    padding-right: 1.6em;
  }
</style>
